<template>
  <div class="uni-margin-wrap">
    <swiper class="swiper" circular indicator-dots indicator-color="rgba(0, 0, 0, .3)" indicator-active-color="#FFF"
      autoplay :interval="5000" :duration="2000">
      <swiper-item v-for="item of imgList" @click="toPageFn(item.toPage)">
        <img mode="heightFix" class="carousel-img" :src="item.path" />
      </swiper-item>
    </swiper>
  </div>
</template>
<script setup>
defineProps({
  imgList: Array,
});

const toPageFn = (page) => {
  console.log(page, 6666);
  if (page.indexOf("http") > -1) {
    uni.navigateTo({ url: `/pages/webview/index?url=${page}` });
  } else {
    uni.navigateTo({ url: page });
  }
};
</script>
<style lang="less" scoped>
.uni-margin-wrap {
  margin-top: 30rpx;
  width: 100%;
  text-align: center;
  border-radius: 35rpx;
  overflow: hidden;
}

.swiper {
  height: 300rpx;
  width: 100%;
}

.swiper-item {
  display: block;
  height: 300rpx;
  width: 100%;
  overflow: hidden;
}

.carousel-img {
  border-radius: 35rpx;
  width: 100%;
  height: 300rpx;
}
</style>
